// 箭头类
			class Arrow {
				constructor(props) {
				    this.w = 50
					this.h = 20
					this.x = 0;
					this.y=0;
					this.fillStyle = 'rgba(65,168,99,1)'
					this.strokeStyle = 'rgba(0,0,0,0)'
					this.rotation = 0;
					Object.assign(this,props)
					return this
				}
				createPath(ctx){
					var {w,h} = this
					
						ctx.beginPath()
						ctx.moveTo(-w/2,-h/2)
						ctx.lineTo(w/10,-h/2)
						ctx.lineTo(w/10,-h)
						// 
						ctx.lineTo(w/2,0)
						ctx.lineTo(w/10,h)
						ctx.lineTo(w/10,h/2)
						ctx.lineTo(-w/2,h/2)
						ctx.closePath()
					
				}
				render(ctx){
					var {strokeStyle,fillStyle,rotation,x,y} = this
					ctx.save()
						// 注意：先将位置移动到中心点，再进行旋转填充绘制。
						ctx.translate(x,y)
						// 旋转
						ctx.rotate(rotation)
						// 设置样式
						ctx.strokeStyle = strokeStyle
						ctx.fillStyle = fillStyle
						// 绘制路径
						this.createPath(ctx)
						
						// 描边
						ctx.stroke()
						// 填充
						ctx.fill()
						
					
					ctx.restore()
					return this
				}
			}